  <!-- valine -->
  {{- if .Site.Params.valine.enable -}}
  <!-- id 将作为查询条件 -->
  <link rel="stylesheet" href="{{ "css/custom.css" | absURL }}" />
  <div id="vcomments" lang="{{ $.Site.LanguageCode | default "en" }}" mess="{{ i18n "comment_placeholder" }}"></div>

  <script type="text/javascript">
    const placeholder = document.getElementById("vcomments").getAttribute("mess"),
          lang = document.getElementById("vcomments").getAttribute("lang");
    const  langs = lang == "zh-cn" ? "zh-cn" : "en";
    new Valine({
        el: '#vcomments' ,
        appId: '{{ .Site.Params.valine.appId }}',
        appKey: '{{ .Site.Params.valine.appKey }}',
        avatar:'{{ .Site.Params.valine.avatar }}', 
        placeholder: placeholder,
        visitor: true,
		    meta: ['nick','mail','link'],
        lang: langs
    });
  </script>
  {{- end -}}